<template>
  <view class="content" :style="DynamicHeight">
    <view class="head">
      <image src="@/static/login/xlogo.png" mode="aspectFill" class="image" />
      <view class="name">江苏绿港集团云平台</view>
      <view class="tip" :style="{ color: hasUpdate ? 'red' : '#606266' }"> {{ hasUpdate ? `发现新版本 ${newVision}` :
        `版本${appVersion}` }}</view>
    </view>
    <view class="cell">
      <u-cell-group :border="false">
        <u-cell title="功能介绍" :isLink="true" size="large" @click="handleJump('/pages/user/introduce')"></u-cell>
        <u-cell title="检查新版本" :isLink="true" size="large" @click="update">
          <template #right-icon>
            <view style="font-size: 14px;" :style="{ color: hasUpdate ? 'red' : '#606266' }">
              {{ hasUpdate ? `发现新版本 ${newVision}` : '' }}
            </view>
            <view style="font-size: 16px;color: #909399;">
              <up-icon name="arrow-right"></up-icon>
            </view>
          </template>
        </u-cell>
      </u-cell-group>
    </view>

    <UpdateModal :upLoadUrl="upLoadUrl" :newVision="newVision" :appStoreUrl='appStoreUrl' :show="show" :log="log"
      @close="close"></UpdateModal>
    <!-- #ifdef H5 -->
    <hwUpVersion :newVision="hwnewVision" :show="hwshow" :log="hwlog"></hwUpVersion>
    <!-- #endif -->

    <!-- 备案信息 -->
    <view class="container">
      <text class="record" @tap="openBeian">备案号：苏ICP备17003213号-4A</text>
      <text class="company">江苏绿港现代农业发展股份有限公司</text>
    </view>
  </view>
</template>

<script>
import setting from "@/apis/cloud/setting.js";
import upVersion from "@/components/as-upVersion/as-upVersion.vue";
import hwUpVersion from "@/components/as-upVersion/hw-upVersion.vue";
import UpdateModal from "@/components/as-upVersion/UpdateModal.vue";
import { useVersionStore } from "@/pinia-store/user.js";
import { mapStores } from "pinia";
export default {
  components: {
    hwUpVersion,
    upVersion,
    UpdateModal
  },
  data () {
    return {
      appVersion: '',
      versionShow: false,
      version: '',
      upLoadUrl: "", // 安卓下载链接
      newVision: "", // 最新版本号
      appStoreUrl: '',// AppStore链接,
      log: '',
      show: false,

      hwnewVision: 0, // h5版本号
      hwlog: '', //备注
      hwshow: false, // h5展示更新
      hasUpdate: false, // 是否有更新
      versionStore: null,
      height: 0,
      DynamicHeight: {},
      tabsDynamicHeight: {},
    }
  },
  computed: {
    ...mapStores(useVersionStore),
  },
  onLoad () {
    //获取版本信息
    this.getVersion();
  },
  onShow () {
    if (!this.versionStore) {
      this.versionStore = useVersionStore()
    }
    this.hasUpdate = this.versionStore.hasUpdate
    this.newVision = this.versionStore.newVision
  },
  created () {
    this.height = (uni.getSystemInfoSync().windowHeight || uni.getSystemInfoSync().screenHeight) || 0

    this.DynamicHeight = {
      height: `${this.height}px`,
      overflow: 'hidden'
    }
  },
  methods: {
    getVersion () {
      const systemInfo = uni.getSystemInfoSync();
      // #ifdef APP-PLUS
      this.appVersion = systemInfo.appWgtVersion;  // 原生APP的版本号（如Android/iOS）
      // #endif
      // #ifdef H5
      this.appVersion = systemInfo.appVersion;     // H5环境的版本号
      // #endif
    },
    handleJump (url) {
      uni.navigateTo({
        url: url
      });
    },
    update () {
      this.checkVersion();
    },
    async checkVersion () {
      if (this.hasUpdate) {
        // #ifdef APP-PLUS
        this.newVision = this.versionStore.newVision
        this.upLoadUrl = this.versionStore.upLoadUrl
        this.log = this.versionStore.log
        this.show = true
        // #endif

        // #ifdef H5
        this.hwnewVision = this.versionStore.newVision
        this.hwlog = this.versionStore.log
        this.hwshow = true

        // #endif

      } else {
        const systemInfo = uni.getSystemInfoSync();
        const platform = systemInfo.uniPlatform || systemInfo.platform;
        const res = await setting.latestVersion({
          platform: platform.toLocaleLowerCase(),
          version: this.appVersion
        });
        if (res.status == 1) {
          if (res.data.version_name == this.appVersion) {
            uni.showToast({
              title: '已经是最新版本',
            });
            return;
          }
          // #ifdef H5
          this.appVersion = res.data.version_name
          // #endif
          // #ifdef APP-PLUS
          this.newVision = res.data.version_name
          this.appStoreUrl = ''
          this.upLoadUrl = res.data.url
          this.log = res.data.remark
          this.show = true
          // #endif
        }
      }
    },
    close () {
      this.show = false;
    },
    openBeian () {
      // 使用原生方式打开工信部备案网站（APP端）
      // #ifdef APP-PLUS
      plus.runtime.openURL("https://beian.miit.gov.cn/");
      // #endif
      // #ifdef H5
      window.open("https://beian.miit.gov.cn/", "_blank");
      // #endif
    }
  }
}
</script>

<style lang="scss">
.content {
  background: #f3f4f5;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.head {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 60rpx;
}

.image {
  width: 130rpx;
  height: 130rpx;
}

.name {
  margin-top: 20rpx;
  font-size: 32rpx;
  padding: 10rpx;
  font-weight: bold;
}

.cell {
  background: #fff;
  margin-top: 100rpx;
}

/* 备案信息底部区域 */
.container {
  text-align: center;
  font-size: 24rpx;
  color: #666;
  padding: 30rpx 0 60rpx;
  line-height: 1.8;
  border-top: 1rpx solid #eee;
}

.record {
  color: #007aff;
  // text-decoration: underline;
}

.company {
  display: block;
  margin-top: 6rpx;
}
</style>
